﻿<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<JLL.China.Web.Areas.Portal.Models.BannerModel>" %>
<style type="text/css">
    .style1
    {
        width: 100%;
    }
    label
    {
        font-weight: bold;
        padding-left: 80px;
    }
    .style2
    {
        height: 68px;
    }
    .chz
    {
        width:100px;
    }
</style>
<!-- start main form  -->
<% using (Html.BeginForm("CreateMainDynamicBanner", "SideContent", FormMethod.Post, new { id = "formID", enctype = "multipart/form-data", @class = "validateform" }))
   { %>

<%=Html.HiddenFor(x => x.Banner.Banner_ID) %>
<%=Html.HiddenFor(x =>x.Banner.ParentID) %>
<%=Html.HiddenFor(x => x.Banner_Local.Banner_ID) %>
<%=Html.HiddenFor(x =>x.Banner_Local.ParentID) %>
<div id="mainBanner" style="float: left; width: 100%;">
    <table align="left" cellpadding="10" cellspacing="10" class="style1" style="padding: 5px"
        width="15%">
        <tr>
            <td width="15%">
                <label>
                    Name:
                </label>
            </td>
            <td width="20%" style="padding: 5px; margin: 5px">
                <%= Html.TextBoxFor(m => m.Banner_Local.Title,
                                           new
                                               {
                                                   name = "title_Main",
                                                   id = "title_Main",
                                                   @class = "validate[required] inp-form",
                                                   style = "width: 100%"
                                               }) %>
            </td>
            <td width="15%">
                <td width="20%">
                </td>
                <td width="30%">
                    &nbsp;
                </td>
        </tr>
        <tr>
            <td width="15%">
            </td>
            <td width="20%" style="padding: 5px; margin: 5px">
            </td>
            <td width="15%">
            </td>
            <td width="20%">
            </td>
            <td width="20%">
            </td>
        </tr>
        <tr>
            <td width="15%">
                <label>
                    Type:</label>
            </td>
            <td width="20%" style="padding: 5px; margin: 5px">
                <div class="select_holder">
                    <%=Html.DropDownListFor(m => m.Banner_Local.DynamicType, new List<SelectListItem>
                                                             {
                                                                new SelectListItem{Selected = true, Text="Rotating", Value = "rotating" }, 
                                                                new SelectListItem{Selected = false, Text="List", Value = "list" },
                                                             }, new { id = "mainDynamicType", name = "mainDynamicType", @class = "chzn-nosearch chz" })%></div>
            </td>
            <td width="15%">
                &nbsp;
            </td>
            <td width="20%">
            </td>
            <td width="20%">
            </td>
        </tr>
        <tr>
            <td width="15%">
                <label>
                    Status:</label>
            </td>
            <td width="20%" style="padding: 5px; margin: 5px">
                <div class="select_holder">
                    <%=Html.DropDownListFor(m => m.Banner_Local.Status, new List<SelectListItem>
                                                             {
                                                                new SelectListItem{Selected = true, Text="Show", Value = "true" }, 
                                                                new SelectListItem{Selected = false, Text="Hide", Value = "false" },
                                                             }, new {  @class = "chzn-nosearch chz" })%></div>
            </td>
            <td width="15%">
                &nbsp;
            </td>
            <td width="20%">
            </td>
            <td width="20%">
            </td>
        </tr>
        <tr>
            <td width="15%">
            </td>
            <td width="20%" style="padding: 5px; margin: 5px">
            </td>
            <td width="15%">
            
                <input type="submit" value="Submit" onclick="checkFormMain()" class="buttons" style="margin-right: 8px;
                    float: left" />
                    
            </td>
            <td width="20%">
            </td>
            <td width="20%">
            </td>
        </tr>
        <tr>
            <td width="15%">
            </td>
            <td width="20%">
            </td>
            <td width="15%">
                &nbsp;
            </td>
            <td align="right" width="20%">
                &nbsp;
            </td>
            <td align="right" width="20%" style="padding: 10px; margin: 10px">
                &nbsp;
            </td>
        </tr>
        
    </table>
</div>
<%} %><!-- end id-form  -->
<!-- start main form  -->

<div id="subBanner" style="float: left; width: 100%;" >
    <% using (Html.BeginForm("CreateDynamic", "SideContent", FormMethod.Post, new { id = "subformID", enctype = "multipart/form-data", @class = "validateform" }))
   { %>
 
<%if (Model.Banner_Local != null){ %>
  <hr style=" width: 65%; margin-left: 78px; margin-bottom: 15px;"/>
<p><h3 style="margin-left:78px">Upload Banner </h3></p>
<%=Html.HiddenFor(x => x.Banner.Banner_ID) %>
<%=Html.HiddenFor(x =>x.Banner.ParentID) %>
<%=Html.HiddenFor(x =>x.Banner_Local.ParentID) %>
    <table align="left" cellpadding="10" cellspacing="10" class="style1" style="padding: 5px"
        width="15%">
        <tr>
            <td width="15%">
                <label>
                    Title (English):
                </label>
            </td>
            <td width="20%" style="padding: 5px; margin: 5px">
                <%= Html.TextBoxFor(m => m.Banner.Title,
                                           new
                                               {
                                                   name = "title",
                                                   id = "title",
                                                   @class = "validate[required] inp-form",
                                                   style = "width: 100%"
                                               }) %>
            </td>
            <td width="15%">
                <label>
                    Link banner to:</label>
            </td>
            <td width="20%">
                <%= Html.TextBoxFor(m => m.Banner.Link, new { name = "link", id = "link", @class = "validate[required] inp-form", style = "width: 100%" })%>
            </td>
            <td width="30%">
                &nbsp;
            </td>
        </tr>
        <tr>
            <td width="15%" class="style2">
                <label>
                    Show Banner:</label>
            </td>
            <td width="20%" style="padding: 5px; margin: 5px" class="style2">
                <div class="select_holder">
                    <%=Html.DropDownListFor(m => m.Banner.Status, new List<SelectListItem>
                                                             {
                                                                new SelectListItem{Selected = true, Text="Show", Value = "true" }, 
                                                                new SelectListItem{Selected = false, Text="Hide", Value = "false" },
                                                             }, new { id = "banner_status", name = "banner_status", @class = "chzn-nosearch chz" })%></div>
            </td>
            <td width="15%" class="style2">
                <label>
                    Select Image:</label>
            </td>
            <td width="20%" class="style2">

                <script>
                    function checkFileExtension(elem) {
                        var filePath = elem.value;


                        if (filePath.indexOf('.') == -1)
                            return false;


                        var validExtensions = new Array();
                        var ext = filePath.substring(filePath.lastIndexOf('.') + 1).toLowerCase();


                        validExtensions[0] = 'jpg';
                        validExtensions[1] = 'jpeg';
                        validExtensions[2] = 'bmp';
                        validExtensions[3] = 'png';
                        validExtensions[4] = 'gif';



                        for (var i = 0; i < validExtensions.length; i++) {
                            if (ext == validExtensions[i])
                                return true;
                        }


                        alert('The file extension ' + ext.toUpperCase() + ' is not allowed!');
                        $('.inputfile').empty();
                        $('.inputfile').html('<input type="file" onchange="checkFileExtension(this);" name="file" id="file" />');
                        return false;
                    }
                </script>

                <div class="inputfile">
                    <input type="file" name="file" id="file" onchange="checkFileExtension(this);" /></div>
            </td>
            <td width="20%" class="style2">
            </td>
        </tr>
       
        <tr>
            <td width="15%">
            </td>
            <td width="20%" style="padding: 5px; margin: 5px">
            </td>
            <td width="15%">
                
            </td>
            <td width="20%" align="right">
            <input type="submit" value="Submit" onclick="checkForm()" class="buttons" style="margin-right: 8px;
                    float: right" />
            
            </td>
            <td width="20%">
            </td>
        </tr>
        <tr>
            <td width="15%">
            </td>
            <td width="20%">
            </td>
            <td width="15%">
                &nbsp;
            </td>
            <td align="right" width="20%">
                &nbsp;
            </td>
            <td align="right" width="20%" style="padding: 10px; margin: 10px">
                &nbsp;
            </td>
        </tr>
        <tr>
            <td width="15%">
                &nbsp;
            </td>
            <td width="20%">
                &nbsp;
            </td>
            <td width="15%">
                &nbsp;
            </td>
            <td width="20%">
                &nbsp;
            </td>
            <td width="20%">
                &nbsp;
            </td>
        </tr>
    </table>
    
</div>

<div class="image_area" id="mediaphoto_content">
 <hr style=" width: 65%; margin-left: 78px; margin-bottom: 15px;"/>
    <h3 style='margin-left:78px'> Listing Banners</h3>
    <div class="list">
        <% if (Model.Banners != null && this.Model.Banners.Count > 0)
           {%>
        <ul id="list1">
            <%
                string ImagePath = Url.Content("~/") + "Media/Banner/SideContent/";

                foreach (var item in this.Model.Banners)
                {
            %>
            <li data-itemid='<%= item.Banner_ID %>'>
                <div>
                    <span><b>
                        <%= item.Title %></b></span>
                </div>
                <div>
                    <% 
                        if (string.IsNullOrEmpty(item.BannerUrl))
                        {
                    %>
                    <img class="img_photo" src="<%= Url.Content("~/") %>Content/images/no_img_default.png" />
                    <% }
                                        else
                                        {%>
                    <img class="img_photo" src="<%= Url.Content("~/") %>Media/Banner/SideContent/<%=item.BannerUrl %>"
                        alt="<%=item.Title %>" />
                    <% } %>
                </div>
                <div class="tools">
                    <div class="t-left">
                        &nbsp;</div>
                    <div class="t-center">
                        <a class="statuslink info-tooltip" href="<%=Url.Content("~/")+ViewData["now_controller"]%>CreateDynamic/<%=item.Banner_ID%>?parentid=<%=item.ParentID%>"
                            title="Edit">
                            <img src="<%=Url.Content("~/Content/")%>images/File_edit.png" name="" /></a>
                        <a class="removelink remove-btn info-tooltip" href="<%=Url.Content("~/")+ViewData["now_controller"]%>DeleteDynamicSubBanner/<%=item.Banner_ID%>?parentid=<%=item.ParentID%>"
                            title="Delete">
                            <img src="<%=Url.Content("~/Content/")%>images/icon_delete.png" /></a> <a class="fancybox-button info-tooltip"
                                rel="fancybox-button" href="<%=ImagePath+item.BannerUrl%>" title="Zoom this image">
                                <img src="<%=Url.Content("~/Content/")%>images/icon-zoom.png" /></a>
                    </div>
                    <div class="t-right">
                        &nbsp;</div>
                </div>
            </li>
            <%}     
            %>
        </ul>
        <%}
           else
           { %>
        <ul style='margin-left:78px'>
            <li> No banners at the moment </li>
           
        </ul>
        <%} %>
       
    </div>
    <!--#list-->
</div>
<%} %> 
<%} %><!-- end id-form  -->